<template>
  <div class="files">
    <div class="files-header">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/user/home/menu' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>缴费开票</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="parent">
      <el-popover placement="bottom" trigger="click">
        <template :loading="loading">
          <el-checkbox v-model="checked" @change="allChange">全选</el-checkbox>
          <br />
          <el-checkbox v-model="checked0">订单编号</el-checkbox>
          <br />
          <el-checkbox v-model="checked4">订单状态</el-checkbox>
          <br />
          <el-checkbox v-model="checked6">专利名称</el-checkbox>
          <br />
          <el-checkbox v-model="checked1">专利类型</el-checkbox>
          <br />
          <el-checkbox v-model="checked3">申请号</el-checkbox>
          <br />
          <el-checkbox v-model="checked2">专利权人</el-checkbox>
          <br />
          <el-checkbox v-model="checked7">发明人</el-checkbox>
          <br />
          <el-checkbox v-model="checked13">支付状态</el-checkbox>
          <br />
          <el-checkbox v-model="checked20">缴费凭证</el-checkbox>
          <br />
          <el-checkbox v-model="checked9">专属顾问</el-checkbox>
          <br />
          <el-checkbox v-model="checked10">代理人</el-checkbox>
          <br />
          <el-checkbox v-model="checked5">提交时间</el-checkbox>
          <br />
        </template>
        <span slot="reference" class="tag2" @click=" ">
          <font color="#31A3FF">显示字段</font>
        </span>
      </el-popover>

      <span class="down-execel3">
        <Poptip v-model="showFilter" placement="bottom-end" @on-popper-show="getAllAgent">
          <a href="javascript:;">列表查找</a>
          <div slot="content">
            <Poptip v-model="showFilterCondition" placement="bottom-start" class="poptip-condition">
              <a href="javascript:;" class="poptip-condition-add">添加过滤条件</a>

              <div slot="content" class="condition-list">
                <ul>
                  <li
                    v-for="(item, index) in columns"
                    :key="index"
                    class="poptip-condition-item"
                    @click="addFilterCondition(item)"
                  >{{item.label}}</li>
                </ul>
              </div>
            </Poptip>

            <el-form
              :model="conditionForm"
              ref="conditionForm"
              label-min-width="120px"
              class="demo-dynamic"
              @submit.native.prevent
            >
              <template v-for="(condition, index) in conditionForm.condition">
                <el-form-item
                  v-if="condition.label == '发明人' || condition.label == '申请号' || condition.label == '代理人' "
                  :label="condition.label"
                  :key="condition.key"
                  :prop="'condition.' + index + '.value'"
                  :rules="{ required: true, message: condition.label +'不能为空', trigger: 'blur' }"
                >
                  <!-- 添加空格 对齐 -->
                  <label slot="label">{{condition.label}}&emsp;</label>
                  <el-select
                    size="small"
                    filterable
                    v-model="condition.value"
                    v-if="condition.label === '代理人'"
                  >
                    <el-option
                      v-for="item in agentOptions"
                      :key="item.id"
                      :label="item | agentNumAddName"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                  <el-input
                    v-else
                    size="small"
                    v-model="condition.value"
                    @keyup.enter.native="submitsearch('conditionForm')"
                  ></el-input>
                  <!-- <el-button @click.stop="removeDomain(condition)" size="mini">删除</el-button> -->
                  <!-- 删除 -->
                  <i
                    class="el-icon-close recommend-close"
                    @click.stop="removeDomain(condition)"
                    style="font-size:25px;margin-left:20px;vertical-align:middle"
                  ></i>
                </el-form-item>
                <el-form-item
                  v-else
                  :label="condition.label"
                  :key="condition.key"
                  :prop="'condition.' + index + '.value'"
                  :rules="{ required: true, message: condition.label +'不能为空', trigger: 'blur' }"
                >
                  <el-select
                    v-if="condition.label === '专利类型'"
                    v-model="condition.value"
                    placeholder="请选择专利类型"
                    size="small"
                  >
                    <el-option label="发明专利" value="F"></el-option>
                    <el-option label="外观设计" value="W"></el-option>
                    <el-option label="实用新型" value="S"></el-option>

                    <el-option label="不确定" value="S"></el-option>
                  </el-select>
                  <el-select
                    v-else-if="condition.label === '支付状态'"
                    v-model="condition.value"
                    placeholder="请选择支付状态"
                    size="small"
                  >
                    <el-option label="已缴费" value="1"></el-option>
                    <el-option label="未缴费" value="2"></el-option>
                  </el-select>

                  <el-select
                    v-else-if="condition.label === '订单状态'"
                    v-model="condition.value"
                    placeholder="请选择订单状态"
                    size="small"
                  >
                    <el-option label="等待提交国知局" value="等待提交国知局"></el-option>
                    <el-option label="已提交国知局" value="已提交国知局"></el-option>
                    <el-option label="等待补正" value="等待补正"></el-option>
                    <el-option label="已补正" value="已补正"></el-option>
                    <el-option label="等待答复" value="等待答复"></el-option>
                    <el-option label="已答复" value="已答复"></el-option>
                    <el-option label="发明人确认答复中" value="发明人确认答复中"></el-option>
                    <el-option label="发明人确认补正中" value="发明人确认补正中"></el-option>
                    <el-option label="初步审查合格" value="初步审查合格"></el-option>
                    <el-option label="实质审查中" value="实质审查中"></el-option>
                    <el-option label="驳回" value="驳回"></el-option>
                    <el-option label="授权" value="授权"></el-option>
                    <el-option label="下证" value="下证"></el-option>
                    <el-option label="撤案" value="撤案"></el-option>
                  </el-select>

                  <el-date-picker
                    v-model="submitTime"
                    type="daterange"
                    placeholder="选择日期"
                    value-format="yyyy-MM-dd"
                    size="small"
                    :validate-event="false"
                    @input="changInput"
                    v-else-if="condition.label === '提交时间'"
                  ></el-date-picker>
                  <el-select
                    size="small"
                    filterable
                    v-model="condition.value"
                    v-else-if="condition.label === '代理人'"
                  >
                    <el-option
                      v-for="item in agentOptions"
                      :key="item.id"
                      :label="item | agentNumAddName"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                  <el-select
                    size="small"
                    filterable
                    v-model="condition.value"
                    v-else-if="condition.label === '专属顾问'"
                  >
                    <el-option
                      v-for="item in processOptions"
                      :key="item.id"
                      :label="item.email_work.split('@')[0].split('followup')[1]"
                      :value="item.id"
                    ></el-option>
                  </el-select>

                  <el-input
                    v-else
                    size="small"
                    v-model="condition.value"
                    @keyup.enter.native="submitsearch('conditionForm')"
                  ></el-input>
                  <!-- <el-button @click.stop="removeDomain(condition)" size="mini">删除</el-button> -->
                  <!-- 删除 -->
                  <i
                    class="el-icon-close recommend-close"
                    @click.stop="removeDomain(condition)"
                    style="font-size:25px;margin-left:20px;vertical-align:middle"
                  ></i>
                </el-form-item>
              </template>
            </el-form>
            <div class="btns">
              <el-button @click.stop="resetForm('conditionForm')" size="mini">重置</el-button>
              <el-button @click="submitsearch('conditionForm')" size="mini">查询</el-button>
            </div>
          </div>
        </Poptip>
      </span>
      <span class="soft-patent3" @click="invoiceQuery">
        未开发票
      </span>
      <span class="soft-patent3" @click="invoiced">
        已开发票
      </span>
      <span class="soft-writing3">
        缴费查询
      </span>

      <el-table
        v-if="table_show"
        ref="parentTb"
        filters
        stripe
        :data="tableData"
        border
        style="width: 100%;"
        height="87%"
        v-loading="loading"
        @sort-change="tableSortChange"
        @row-click="selectRow"
      >
        <el-table-column
          show-overflow-tooltip
          prop="order_number"
          v-if="checked0"
          label="订单编号"
          min-width="200"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.order_number }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="status"
          label="订单状态"
          min-width="150"
          v-if="checked4"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.status }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="name"
          label="专利名称"
          v-if="checked6"
          min-width="150"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.name }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="type"
          label="专利类型"
          min-width="120"
          v-if="checked1"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.type == 'S'">实用新型</span>
            <span v-if="scope.row.type == 'W'">外观设计</span>
            <span v-if="scope.row.type == 'F'">发明专利</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="application_number"
          label="申请号"
          v-if="checked3"
          min-width="150"
          align="left"
          sortable="left"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.application_number }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="patent_user"
          label="专利权人"
          v-if="checked2"
          min-width="130"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.order">{{ scope.row.order.patent_user }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="user_name"
          label="发明人"
          v-if="checked7"
          min-width="130"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.order">{{ scope.row.order.user_name }}</span>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          v-if="checked13"
          prop="consumer_pay_status"
          label="支付状态"
          min-width="110"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span
              v-if="scope.row.status != '撤案'"
              :class="(scope.row.consumer_pay_status == 1 || scope.row.consumer_pay_status == 0) ? 'finish' : (scope.row.consumer_pay_status == 2 ? 'unfinish' : 'orange')"
            >{{ (scope.row.consumer_pay_status == 1 || scope.row.consumer_pay_status == 0) ? '已缴费' : (scope.row.consumer_pay_status == 2 ? '未缴费' : '已退款') }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="缴费凭证"
          min-width="120"
          align="left"
          v-if="checked20"
          class-name="pay-status"
          sortable="custom"
          prop="consumer_pay_img"
        >
          <template slot-scope="scope">
            <div @click.stop style="height: 40px">
              <el-image
                v-if="scope.row.consumer_pay_img_thumb != ''"
                :src="scope.row.consumer_pay_img_thumb"
                :preview-src-list="[scope.row.consumer_pay_img]"
              ></el-image>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          v-if="checked9"
          prop="process"
          label="专属顾问"
          min-width="120"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <!-- <div class="more">{{scope.row.process.name}}</div> -->
            <div class="more">
              <span
                style="margin-right: 10px"
                v-if="scope.row.order && scope.row.order.process"
              >{{ scope.row.order.process.email_work.split("@")[0].split("followup")[1] }}</span>
              <Tooltip v-if="scope.row.order && scope.row.order.process" content="点我留言">
                <i
                  class="el-icon-chat-dot-round leaveWord"
                  @click.stop="leaveWord(scope.row, 'process')"
                ></i>
              </Tooltip>
            </div>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          v-if="checked10"
          prop="agent"
          label="代理人"
          min-width="120"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.agent">{{ scope.row.agent | agentNumber }}</span>
            <Tooltip v-if="scope.row.agent" content="点我留言">
              <i class="el-icon-chat-dot-round leaveWord" @click.stop="leaveWord(scope.row)"></i>
            </Tooltip>
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          prop="submit_at"
          label="提交时间"
          min-width="120"
          v-if="checked5"
          align="left"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.submit_at }}</span>
          </template>
        </el-table-column>

        <el-table-column v-if="checked99" width="150" align="center" label="操作" fixed="right">
          <template slot-scope="scope">
            <div @click.stop>
              <el-popover
                placement="bottom"
                width="150"
                v-model="scope.row.showBtns"
                trigger="click"
              >
                <el-button
                  v-if="scope.row.consumer_pay_status == 2"
                  type="primary"
                  size="small"
                  @click.stop="goPay(scope.row)"
                >在线支付
                <el-popover placement="top" title="在线支付" width="200" trigger="hover">
                  <span>请进行线上支付。</span>
                  <i class="el-icon-info orange ml10" slot="reference"></i>
                </el-popover></el-button>
                <br />
                <el-button
                  v-no-more-click:3000
                  @click.stop="upBill(scope.row)"
                  class="mt10"
                  type="success"
                  size="small"
                  :disabled="(scope.row.status != '等待提交国知局' && scope.row.status != '已提交 国知局' && scope.row.status == '撤案') || scope.row.consumer_pay_status != 2 || scope.row.consumer_pay_img != null"
                >已&nbsp; 缴&nbsp; 费 
                <el-popover placement="top" title="缴费截图" width="200" trigger="hover">
                  <span>请上传您的支付截图作为缴费凭证。</span>
                  <i class="el-icon-info orange ml10" slot="reference"></i>
                </el-popover></el-button>
                
                <el-button
                  slot="reference"
                  type="primary"
                  :disabled="(scope.row.consumer_pay_img != null || scope.row.order_number.slice(0,2) == 'ZN') || scope.row.status == '撤案'"
                  v-if=" scope.row.consumer_pay_status == 2" 
                  @click.stop="showPayBtns(scope.row)"
                >去支付</el-button>
              </el-popover>
              <el-button
                type="primary"
                disabled
                v-if="scope.row.consumer_pay_status == 1 || scope.row.consumer_pay_status == 0"
              >已缴费</el-button>
              <el-button
                type="primary"
                disabled
                v-if="scope.row.consumer_pay_status != 1 && scope.row.consumer_pay_status != 0 && scope.row.consumer_pay_status != 2"
              >已退款</el-button>
            </div>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination
        background
        class="pagination"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="pageSizes"
        :page-size="Number(pageSize)"
        layout="total, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>

      <!-- 留言框 -->
      <el-dialog
        title="留言"
        :visible.sync="showRefund4"
        center
        @close="leaveWordClose"
        class="leaveWordDialog"
      >
        <span class="leaveWord-label">请输入你的留言</span>
        <el-input type="textarea" v-model="leaveWordText"></el-input>
        <span slot="footer" class="dialog-footer">
          <el-button type="warning" size="small" @click="showRefund4 = false">取消</el-button>
          <el-button
            @click="submitLeaveWord"
            type="primary"
            size="small"
            v-no-more-click:3000
            :loading="leaveWordLoading"
          >确定</el-button>
        </span>
      </el-dialog>
      <upload-fee ref="upload-fee" @refresh="refresh"></upload-fee>

      <!-- 信息提示框 -->
      <promptMessage ref="promptMessage" />

      <!-- 查看订单 -->
      <lookOrder
        ref="lookOrder"
        @agentRate="agentRate"
        @additionalRate="additionalRate"
        @refresh="refresh"
      />
      <rate ref="rate" @refresh="refresh"></rate>
      <additionalRate ref="additionalRate" @refresh="refresh" :type="2"></additionalRate>
    </div>
  </div>
</template>

<script>
import uploadFee from "./components/upload-fee";
import promptMessage from "~/components/promptMessage";
import lookOrder from "./components/lookOrder";
import fncSearch from "~/components/searchSrceen/fnc-search.js";
import rate from "~/components/rate";
import { sendPrivateLetter } from "~/util/index";
import additionalRate from "~/components/additionalRate";

export default {
  components: {
    uploadFee,
    promptMessage,
    lookOrder,
    rate,
    fncSearch,
    additionalRate
  },
  data() {
    return {
      finals_id:'',
      order_id:'',
      showBtns: false,
      checked99: true,
      table_show: true,
      checked: true,
      checked0: true,
      checked1: true,
      checked2: true,
      checked3: true,
      checked4: true,
      checked5: true,
      checked6: true,
      checked7: true,
      checked8: true,
      checked9: true,
      checked10: true,
      checked12: true,
      checked13: true,
      checked14: true,
      checked15: true,
      checked20: true,
      tableData: [],
      loading: true,
      pageSizes: [25, 50],
      pageSize: 25,
      tableSize: 10, //一页几条
      tableStart: 0, //table数组过滤的第一条索引
      tableEnd: 10, //table数组过滤的最后一条索引
      currentPage: 1, //目前在第几页
      total: 0,
      routeid: "patent",
      showFilter: false, // 控制显示筛选条件
      showFilterCondition: false,
      baseUrl: global.baseurl,
      conditionForm: {
        condition: []
      }, //筛选条件
      columns: [
        {
          label: "订单编号",
          id: 1,
          parameter: "order_number"
        },
        {
          label: "订单状态",
          id: 9,
          parameter: "status"
        },
        {
          label: "专利类型",
          id: 3,
          parameter: "type"
        },
        {
          label: "专利名称",
          id: 2,
          parameter: "name"
        },
        {
          label: "申请号",
          id: 8,
          parameter: "application_number"
        },
        {
          label: "专利权人",
          id: 4,
          parameter: "patent_user"
        },
        {
          label: "发明人",
          id: 5,
          parameter: "user_name"
        },
        {
          label: "专属顾问",
          id: 6,
          parameter: "process_id"
        },
        {
          label: "代理人",
          id: 7,
          parameter: "agent_id"
        },
        {
          label: "提交时间",
          id: 10,
          parameter: "subimt_time"
        },
        {
          label: "支付状态",
          id: 11,
          parameter: "consumer_pay_status"
        }
      ],
      submitTime: [],
      showRefund3: false,
      download_js: null,
      // stepsText: ['等待提交', '已提交国知局', '审查通过', '授权', '下证'],
      stepsText: ["等待提交", "已提交国知局", "审查通过", "授权"],
      opDateMax: 0,
      step_type: "success",
      opData: [],
      showOP: true,
      paramsByPatent: {
        status:
          "等待提交国知局,已提交国知局,等待补正,已补正,等待答复,已答复,初步审查合格,实质审查中,驳回,授权,发明人确认答复中,发明人确认补正中,下证,撤案",
        sort_str: "created_at",
        sort_order: "desc"
        // page: 1
      },
      showRefund4: false,
      leaveWordText: "",
      leaveWordId: "",
      leaveWordEmail: "",
      leaveWordData: {},
      LorD: "",
      leaveWordLoading: false,
      agentOptions: [],
      processOptions: [],
      privateLetterId: null
    };
  },

  computed: {
    selectArr() {
      let arr = [
        this.checked0,
        this.checked1,
        this.checked2,
        this.checked3,
        this.checked4,
        this.checked5,
        this.checked6,
        this.checked7,
        this.checked8,
        this.checked9,
        this.checked10,
        this.checked12,
        this.checked13,
        this.checked14,
        this.checked15,
        this.checked20
      ];
      return arr;
    }
  },
  watch: {
    tableData: {
      handler: function(val) {
        val.forEach(v => {
          if (v.consumer_pay_img) {
            v.consumer_pay_img =
              this.baseUrl + "/storage/upload/" + v.consumer_pay_img;
          }
          if (v.consumer_pay_img_thumb) {
            v.consumer_pay_img_thumb =
              this.baseUrl + "/storage/upload/" + v.consumer_pay_img_thumb;
          }
        });
      },
      immediate: true
    },
    selectArr(val) {
      this.table_show = false;
      this.$nextTick(() => {
        this.table_show = true;
      });
      setTimeout(() => {
        this.$nextTick(() => {
          this.gwm();
        });
      }, 300);
      if (val.some(v => v == false)) {
        this.checked = false;
      } else {
        this.checked = true;
      }
      if (val.every(v => v == false)) {
        this.checked99 = false;
      } else {
        this.checked99 = true;
      }
    }
  },
  mounted() {},
  created() {
    let that = this;
    that.$axios
      .get("api/consumer/patent", {
        params: this.paramsByPatent
      })
      .then(res => {
        that.loading = false;
        that.tableData = res.data.data;
        that.pageSize = res.data.page.per_page;
        that.tableSize = res.data.page.per_page;
        that.tableEnd = res.data.page.per_page;
        that.total = res.data.page.total;
        for (let i = 0; i < that.tableData.length; i++) {
          that.files(that.tableData[i]);
          that.tableData[i].showBtns = false;
        }
        // 重绘表格解决错位问题
        this.$nextTick(() => {
          this.$refs.parentTb.doLayout();
        });
      });
  },
  methods: {
    invoiceQuery(){
      this.$router.push('/user/myPay/invoiceQuery')
    },
    invoiced(){
      this.$router.push('/user/myPay/invoiced')
    },
    showPayBtns(data) {
      data.showBtns = !data.showBtns;
    },

    agentRate(data) {
      this.$refs["rate"].showOn(data);
    },
    additionalRate(data) {
      this.$alert("该评价信息为匿名评价，代理人不可见", "提示", {
        confirmButtonText: "确定",
        callback: action => {
          this.$refs["additionalRate"].show(data);
        }
      });
    },
    goPay(data) {
      this.$router.replace({
        name: "payment",
        query: {
          finals_id: data.id,
          order: data.order.id,
          from: this.$route.path
        }
      });
    },
    gwm() {
      //水印,非管理员要设置
      if (
        this.$store.state.user.role_id != 1 &&
        this.$route.path != "/admin/register" &&
        this.$route.path != "/admin/personalCenter/dstribution" &&
        this.$route.path != "/admin/personalCenter/myPurse" &&
        this.$route.path != "/admin/activityList/activityConfig" &&
        this.$route.path != "/admin/activityList/sysConfig" &&
        this.$route.path != "/admin/login" &&
        this.$route.path != "/admin/agentImprove" &&
        this.$route.path != "/order/login"
      ) {
        let that = this;
        let gwm = require("gwm");
        gwm.creation({
          txt: that.$store.state.user.name,
          container: ".el-table", //#gwm
          fontSize: 40
        });
      }
    },
    allChange(val) {
      if (val) {
        this.checked0 = true;
        this.checked1 = true;
        this.checked2 = true;
        this.checked3 = true;
        this.checked4 = true;
        this.checked5 = true;
        this.checked6 = true;
        this.checked7 = true;
        this.checked8 = true;
        this.checked9 = true;
        this.checked10 = true;
        this.checked12 = true;
        this.checked13 = true;
        this.checked14 = true;
        this.checked15 = true;
        this.checked20 = true;
      } else {
        this.checked0 = false;
        this.checked1 = false;
        this.checked2 = false;
        this.checked3 = false;
        this.checked4 = false;
        this.checked5 = false;
        this.checked8 = false;
        this.checked7 = false;
        this.checked6 = false;
        this.checked9 = false;
        this.checked10 = false;
        this.checked12 = false;
        this.checked13 = false;
        this.checked14 = false;
        this.checked15 = false;
        this.checked20 = false;
      }
    },
    refresh() {
      this.search1();
    },
    upBill(row) {
      this.$refs["upload-fee"].showOn(row);
    },
    //选择一页几条
    handleSizeChange(size) {
      this.paramsByPatent.perPage = size;
      this.paramsByPatent.page = 1;
      this.$axios
        .get("/api/consumer/patent", {
          params: this.paramsByPatent
        })
        .then(res => {
          this.tableData = res.data.data;
          for (let i = 0; i < this.tableData.length; i++) {
            this.files(this.tableData[i]);
            this.tableData[i].showBtns = false;
          }
          this.pageSize = res.data.page.per_page;
          this.tableSize = res.data.page.per_page;
          this.tableEnd = res.data.page.per_page;
          this.total = res.data.page.total;
        });
    },
    handleCurrentChange(val) {
      // this.currentPage = val;
      let that = this;
      let params = this.paramsByPatent;
      this.paramsByPatent.page = val;
      // let page = val;
      that.$axios
        .get("/api/consumer/patent?page=" + val, {
          params
        })
        .then(res => {
          this.loading = false;
          this.tableData = res.data.data;
          for (let i = 0; i < this.tableData.length; i++) {
            this.files(this.tableData[i]);
            this.tableData[i].showBtns = false;
          }
          this.pageSize = res.data.page.per_page;
          this.tableSize = res.data.page.per_page;
          this.tableEnd = res.data.page.per_page;
          this.total = res.data.page.total;
        });
    },

    //获取所有代理人
    getAllAgent() {
      this.$axios
        .get("api/user/agent/all")
        .then(res => {
          if (res.data.status == "success") {
            this.agentOptions = res.data.data;
          }
        })
        .catch(err => {
          // this.$message({
          //   type: "err",
          //   message: err
          // });
        });

      this.$axios
        .get("api/user/process")
        .then(res => {
          if (res.data.code == 200) {
            this.processOptions = res.data.data;
          }
        })
        .catch(err => {
          // this.$message({
          //   type: "err",
          //   message: err
          // })
        });
    },

    addFilterCondition(item) {
      let filterItem = {
        value: "",
        label: item.label,
        parameter: item.parameter,
        key: Date.now()
      };
      if (this.conditionForm.condition.length > 0) {
        let conditionlabels = [];
        for (let i = 0; i < this.conditionForm.condition.length; i++) {
          conditionlabels.push(this.conditionForm.condition[i].label);
        }
        let Check = conditionlabels.indexOf(item.label);
        Check == -1
          ? this.conditionForm.condition.push(filterItem)
          : this.$message.error("请勿重复添加");
      } else {
        this.conditionForm.condition.push(filterItem);
      }

      this.showFilterCondition = false;
    },
    search1() {
      this.currentPage = 1;
      for (var i = 0; i < this.conditionForm.condition.length; i++) {
        let a = this.conditionForm.condition[i].parameter;
        this.paramsByPatent[a] = this.conditionForm.condition[i].value;

        if (this.conditionForm.condition[i].parameter === "subimt_time") {
          this.paramsByPatent.submit_start_time = this.submitTime[0];
          this.paramsByPatent.submit_end_time = this.submitTime[1];
        }
      }

      // 处理排序状态
      delete this.paramsByPatent.sort_str;
      delete this.paramsByPatent.sort_order;
      this.$refs["parentTb"].clearSort();

      //我的订单列表

      this.loading = true;
      this.paramsByPatent.page = 1;
      this.currentPage = 1;
      // console.log(this.paramsByPatent);
      this.$axios
        .get("api/consumer/patent", {
          params: this.paramsByPatent
        })
        .then(res => {
          this.loading = false;
          this.tableData = res.data.data;
          for (let i = 0; i < this.tableData.length; i++) {
            this.files(this.tableData[i]);
            this.tableData[i].showBtns = false;
          }
          this.pageSize = res.data.page.per_page;
          this.tableSize = res.data.page.per_page;
          this.tableEnd = res.data.page.per_page;
          this.total = res.data.page.total;
        });
    },
    files(data) {
      if (data.opinion_file == null || data.opinion_file == "") {
      } else {
        let fish_Arr = data.opinion_file.split("&");
        data.reviewFile = [];
        for (const i in fish_Arr) {
          let itemobj = {
            id: i + 1,
            path: fish_Arr[i],
            file: ""
          };
          let itemArr = itemobj.path.split("/");
          itemobj.path = itemArr[itemArr.length - 1];
          itemobj.file = itemArr.slice(0, 2).join("/");
          data.reviewFile.push(itemobj);
        }
      }
      if (data.answer_file == null || data.answer_file == "") {
      } else {
        let fish_Arr = data.answer_file.split("&");
        data.answerFile = [];
        for (const i in fish_Arr) {
          let itemobj = {
            id: i + 1,
            path: fish_Arr[i],
            file: ""
          };
          let itemArr = itemobj.path.split("/");
          itemobj.path = itemArr[itemArr.length - 1];
          itemobj.file = itemArr.slice(0, 2).join("/");
          data.answerFile.push(itemobj);
        }
      }
      if (data.order) {
        if (data.order.img == null || data.order.img == "") {
        } else {
          let fish_Arr = data.order.img.split("&");
          data.order.imgArr = [];
          for (const i in fish_Arr) {
            let itemobj = {
              id: i + 1,
              path: fish_Arr[i],
              file: ""
            };
            let itemArr = itemobj.path.split("/");
            itemobj.path = itemArr[itemArr.length - 1];
            itemobj.file = itemArr.slice(0, 2).join("/");
            data.order.imgArr.push(itemobj);
          }
        }
        if (data.order.file == null || data.order.file == "") {
        } else {
          let fish_Arr = data.order.file.split("&");
          data.order.fileArr = [];
          for (const i in fish_Arr) {
            let itemobj = {
              id: i + 1,
              path: fish_Arr[i],
              file: ""
            };
            let itemArr = itemobj.path.split("/");
            itemobj.path = itemArr[itemArr.length - 1];
            itemobj.file = itemArr.slice(0, 2).join("/");
            data.order.fileArr.push(itemobj);
          }
        }
      }
      if (data.demand_note_file == null || data.demand_note_file == "") {
      } else {
        let fish_Arr = data.demand_note_file.split("&");
        data.demandNoteFile = [];
        for (const i in fish_Arr) {
          let itemobj = {
            id: i + 1,
            path: fish_Arr[i],
            file: ""
          };
          let itemArr = itemobj.path.split("/");
          itemobj.path = itemArr[itemArr.length - 1];
          itemobj.file = itemArr.slice(0, 2).join("/");
          data.demandNoteFile.push(itemobj);
        }
      }
    },
    resetForm(formName) {
      // this.$refs[formName].resetFields()
      this.$refs["parentTb"].clearSort();
      // this.conditionForm.condition = []
      this.conditionForm.condition.forEach(v => {
        if (v.value) {
          v.value = null;
        }
      });
      this.submitTime = [];
      this.paramsByPatent = {
        status:
          "等待提交国知局,已提交国知局,等待补正,已补正,等待答复,已答复,初步审查合格,实质审查中,驳回,授权,发明人确认答复中,发明人确认补正中,下证,撤案",
        sort_str: "status",
        sort_order: "desc"
      };
      this.$nextTick(() => {
        this.$refs[formName].clearValidate();
      });
      // this.search1()
      // this.showFilterCondition = false
      // this.showFilter = false
    },

    submitsearch(formName) {
      let that = this;
      this.$refs[formName].validate((valid, prop) => {
        // this.$refs[formName].clearValidate();
        let props = [];
        for (let k in prop) {
          props.push(prop[k][0].field);

          if ((prop[k][0].message = "提交时间不能为空")) {
            if (that.submitTime) {
              if (that.submitTime.length > 0) {
                that.$refs[formName].clearValidate([prop[k][0].field]);
                // that.search()
                let timeIndex = props.indexOf("提交时间不能为空");
                props.splice(timeIndex, 1);
              }
            } else {
              return false;
            }
          }
        }
        if (props.length) {
          that.$refs[formName].validateField(props, valid2 => {
            if (valid2) {
              return false;
            } else {
              that.search1();
            }
          });
        } else {
          that.search1();
        }
      });
    },
    removeDomain(item) {
      this.showFilter = true;
      delete this.paramsByPatent[item.parameter];
      let index = this.conditionForm.condition.indexOf(item);
      if (index !== -1) {
        this.conditionForm.condition.splice(index, 1);
      }

      if (item.label === "提交时间") {
        this.submitTime = [];
        delete this.paramsByPatent.submit_start_time;
        delete this.paramsByPatent.submit_end_time;
      }
      this.search1();
    },
    openLook(item) {},
    selectRow(row) {
      // 查看订单详情（国知局后）
      // let orderDetails = {}
      // let params = {
      //   finals:row.id
      // }
      // this.$axios.get(`api/finals/${row.id}/show`,{
      //   params: params
      // }).then(res => {
      //   // console.log(res)
      //   if (res.data.code == 200) {
      //     // console.log(res.data.data)
      //     orderDetails = res.data.data;
      //     console.log(orderDetails)
      //     if(window.getSelection().toString() === ''){

      //       this.$refs.lookOrder.show(orderDetails)
      //     }
      //   }
      // })
      if (window.getSelection().toString() === "") {
        this.$refs.lookOrder.show(row);
      }
      // console.log(row);
    },
    downloadAcceptance(index, row) {
      this.download_js = `js_download${index}`;
      document.getElementById(this.download_js).click();
    },
    tableSortChange(column) {
      if (column.order === "descending") {
        this.paramsByPatent.sort_str = column.prop;
        this.paramsByPatent.sort_order = "desc";
      } else if (column.order === "ascending") {
        this.paramsByPatent.sort_str = column.prop;
        this.paramsByPatent.sort_order = "asc";
      } else {
        delete this.paramsByPatent.sort_str;
        delete this.paramsByPatent.sort_order;
      }
      // if (column.prop == 'order' || column.prop == 'user_name') {
      //   return
      // }
      this.loading = true;
      this.$axios
        .get("api/consumer/patent", {
          params: this.paramsByPatent
        })
        .then(res => {
          this.loading = false;
          this.tableData = res.data.data;
          this.pageSize = res.data.page.per_page;
          this.tableSize = res.data.page.per_page;
          this.tableEnd = res.data.page.per_page;
          this.total = res.data.page.total;

          for (let i = 0; i < this.tableData.length; i++) {
            this.files(this.tableData[i]);
            this.tableData[i].showBtns = false;
          }
        });
    },
    changInput() {
      this.$refs["conditionForm"].clearValidate();
    },
    leaveWord(row, role) {
      this.showRefund4 = true;
      this.showRefund3 = false;
      this.leaveWordId = row.order.id;
      this.finals_id = row.id
      if (role == "process") {
        this.LorD = "专属顾问";
        this.privateLetterId = row.order.process.id;
      } else {
        this.privateLetterId = row.agent.id;
      }
      this.leaveWordData = row;
    },
    quit(data){
      this.$router.push({
        path: '/user/news/caseExchange',
        query:{
          data:JSON.stringify(data)//对象转为字符串
        }
      });
    },
    submitLeaveWord() {
      let that = this;
      let params = {
          news: that.leaveWordText,
          receive_uid: that.privateLetterId,
          finals_id: that.finals_id
      }
      that.$axios.post('api/news/add_private_letter', params).then(res => {
        if (res.data.code == 200) {
          that.$message({
            type: 'success',
            message:"发送留言信息成功！"
          })
          this.showRefund4 = false
          that.leaveWordText = ''
          setTimeout(() => {
            that.quit(res.data.data)
          }, 1000)
        }
      })
      // let that = this;
      // let submitLeaveWordOrder = {
      //   message: that.leaveWordText,
      //   id: this.leaveWordId
      // };
      // let url = "";
      // let agentName = " ";
      // let isProcess = true;
      // if (this.leaveWordData.order.agent) {
      //   agentName = this.leaveWordData.order.agent.name;
      // }

      // if (this.LorD === "专属顾问") {
      //   url = `api/consumer/${that.leaveWordId}/process/message`;
      // } else {
      //   url = `api/consumer/${that.leaveWordId}/message`;
      //   isProcess = false;
      // }
      // that.$axios.post(url, submitLeaveWordOrder).then(({ data }) => {
      //   if (data.code == 200) {
      //     this.showRefund4 = false;
      //     sendPrivateLetter(
      //       this,
      //       this.leaveWordData.id,
      //       this.leaveWordText,
      //       this.privateLetterId,
      //       "final"
      //     );
      //     if (isProcess) {
      //       let pData = {
      //         userName: this.$store.state.user.name,
      //         email: this.leaveWordData.order.process.email_work,
      //         phone: this.leaveWordData.order.process.phone,
      //         number: this.leaveWordData.order.process.email_work
      //           .split("@")[0]
      //           .split("followup")[1]
      //       };
      //       this.$refs["promptMessage"].showDialog("processLeaveWord", pData);
      //     } else {
      //       let pData = {
      //         userName: this.$store.state.user.name,
      //         email: this.leaveWordData.order.agent.email_work,
      //         phone: this.leaveWordData.order.agent.phone,
      //         number: this.leaveWordData.order.agent.email_work
      //           .split("@")[0]
      //           .slice(-3)
      //       };
      //       this.$refs["promptMessage"].showDialog("agentLeaveWord", pData);
      //     }
      //   } else {
      //     this.$message.error(data.message);
      //   }
      // });
      // this.LorD = "";
    },
    leaveWordClose() {
      this.leaveWordText = "";
      this.submitLeaveWordOrder = null;
    }
  }
};
</script>

<style lang='less' type='text/css'>
.files {
  width: 90%;
  height: 100%;
  margin: 0 auto;
  padding: 20px 30px 60px 30px;
  background: rgba(255, 255, 255, 1);
  box-sizing: border-box;
  &-header {
    height: 45px;
    float: left;
    .el-breadcrumb {
      .el-breadcrumb__item {
        .el-breadcrumb__inner,
        .el-breadcrumb__separator {
          font-size: 25px;
          color: rgba(0, 35, 151, 1);
          font-weight: 400;
        }
      }
      .el-breadcrumb__item:first-child {
        .el-breadcrumb__inner {
          padding-left: 10px;
          border-left: 5px solid #002397;
        }
      }
    }
  }
}

.parent {
  height: 100%;

  .el-steps {
    margin: 20px 0;
    .el-step__head {
      &.is-wait {
        .el-step__icon {
          &.is-text {
            .el-step__icon-inner {
              display: none; //不要序号
            }
          }
        }
      }
    }
    .el-step__main {
      // min-width: 110px;
      width: 100%;
      .el-step__title {
        text-align: center;
        font-size: 15px;
        width: 100%;
        line-height: 20px;
      }
    }
  }
  .el-step:nth-child(odd) {
    .el-step__main {
      position: absolute;
      top: -40px;
    }
  }
  .el-step:nth-child(even) {
    .el-step__main {
      margin-top: 15px;
    }
  }
}
.el-checkbox__label {
  color: rgba(142, 142, 142, 1) !important;
}

.el-main
  .poptip-condition
  .ivu-poptip-popper
  .ivu-poptip-content
  .ivu-poptip-inner {
  min-width: 180px;
}
.el-main .ivu-poptip .ivu-poptip-popper .ivu-poptip-content .ivu-poptip-inner {
  min-width: 400px;
  // height: 300px;
  overflow-y: scroll;
}

.down-execel3 {
  display: block;
  font-size: 15px;
  float: right;
  margin-right: 20px;
  border: 1px solid rgba(36, 157, 255, 1);
  border-radius: 12px;
  padding: 2px 13px;
}
.soft-writing3 {
  display: block;
  font-size: 15px;
  float: right;
  margin-right: 20px;
  padding: 2px 13px;
  border: 1px solid rgba(36, 157, 255, 1);
  border-radius: 12px;
  text-align: center;
  background: rgba(36, 157, 255, 1);
  color: #fff;
}
.soft-patent3 {
  display: block;
  font-size: 15px;
  float: right;
  margin-right: 20px;
  text-align: center;
  border:1px solid rgba(36,157,255,1);
  border-radius:12px;
  padding: 2px 13px;
  color: rgba(36,157,255,1);
}
.tag2 {
  display: block;
  font-size: 15px;
  float: right;
  text-align: center;
  border:1px solid rgba(36,157,255,1);
  border-radius:12px;
  padding: 2px 13px;
}

.poptip-condition {
  display: block;
  margin: 10px 0;
  .poptip-condition-item {
    line-height: 25px;
    cursor: pointer;
  }
  .poptip-condition-add {
    font-size: 15px;
  }
}
.demo-dynamic {
  padding-left: 10px;
  .el-form-item {
    margin-bottom: 12px;
  }
  .el-input {
    width: 200px;
  }
  .el-date-editor {
    width: 200px;
  }
  .el-button {
    padding: 9px 15px;
    vertical-align: baseline;
  }
  .el-form-item__error {
    padding-top: 0;
  }
}

.el-main
  .poptip-condition
  .ivu-poptip-popper
  .ivu-poptip-content
  .ivu-poptip-inner {
  min-width: 180px;
}
.el-pagination {
  margin-top: 15px;
}
.btns {
  margin-top: 10px;
}
.downloadA {
  cursor: pointer;
  color: #2d8cf0;
  font-size: 26px;
  margin-right: 5px;
}

.steps {
  margin-left: 20px;
}

.parentLookOrder {
  overflow-y: scroll;
}
.leaveWordDialog {
  .el-dialog {
    width: 30%;
  }
  .leaveWord-label {
    display: block;
    margin-bottom: 10px;
  }
  .el-textarea {
    display: block;
    margin-bottom: 20px;
  }
}
.leaveWord {
  color: rgb(16, 133, 16);
  font-size: 18px;
}
.el-table {
  .el-table__body {
    .pay-status {
      padding: 0;
      .cell {
        display: flex;
        align-items: center;
        justify-content: center;
        .el-image {
          width: 40px;
          height: 40px;
          margin-left: 10px;
          &:nth-last-child(1) {
            margin-left: 0;
          }
          image {
            width: 100%;
            height: 100%;
            display: block;
          }
        }
      }
    }
  }
}
.btns {
  cursor: pointer;
  text-align: right;
  margin-right: 70px;
}
.el-table td{
  padding: 4.5px 0!important;
}
</style>
